<template>
	<view class="normal-login-container">
		<view class="logo-content">
			<image style="width: 280rpx;height: 280rpx;display: block;text-align: center;margin: 70px auto 20px;"
				:src="globalConfig.appInfo.logo" mode="widthFix">
			</image>
			<view class="logo-title">
				物资供应管控平台
			</view>
			<text class="title" style="display: block;margin-top: 10px;font-weight: 700;"></text>
		</view>
		<view class="login-form-content">
			<view class="input-item flex align-center">
				<view class="iconfont"></view>
				<input v-model="loginForm.account" class="input" type="text" placeholder="请输入账号" maxlength="30" />
			</view>
			<view class="input-item flex align-center">
				<view class="iconfont"></view>
				<!-- <input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" /> -->
				<input class="input" v-model="loginForm.password" placeholder="请输入密码" :password="showPassword" />
				<text class="uni-icon" @click="changePassword">
					<u-icon class="uni-eye" :name="!showPassword?'eye-fill':'eye-off'"></u-icon>
					<!-- <u-icon name="eye-off"></u-icon> -->
				</text>
			</view>
			<view class="action-btn">
				<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg round">登录</button>
			</view>
		</view>
		
		<movable></movable>

		<!--    <view class="xieyi text-center">
      <text class="text-grey1">登录即代表同意</text>
      <text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
      <text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
    </view> -->
	</view>
</template>

<script>
	import {
		getCodeImg
	} from '@/api/login'
	export default {
		data() {
			return {
				codeUrl: "",
				captchaEnabled: true,
				globalConfig: getApp().globalData.config,
				loginForm: {
					account: "13002589212", //12345678922  LiuGC
					password: "longnows!@#",
					menuCode: "goldenStar2",
					captchaKey: ''
				},
				showPassword: true
			}
		},
		created() {
			// this.getCode()
		},
		methods: {
			changePassword() {
				this.showPassword = !this.showPassword;
			},
			// 登录方法
			async handleLogin() {
				
				if (this.loginForm.account === "") {
					this.$modal.msgError("请输入您的账号")
				} else if (this.loginForm.password === "") {
					this.$modal.msgError("请输入您的密码")
				} else {
					this.$modal.loading("登录中，请耐心等待...")
					this.pwdLogin()
				}
			},
			// 密码登录
			async pwdLogin() {
				console.log('this.loginForm', this.loginForm)
				this.$store.dispatch('Login', this.loginForm).then(() => {
					this.$modal.closeLoading()
					this.loginSuccess()
				}).catch(() => {})
			},
			// 登录成功后，处理函数
			loginSuccess(result) {
				this.$tab.reLaunch('/pages/index')
				// 设置用户信息
				// this.$store.dispatch('GetInfo').then(res => {
				//   this.$tab.reLaunch('/pages/index')
				// })
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #ffffff;
	}

	.normal-login-container {
		width: 100%;

		.logo-content {
			width: 100%;
			font-size: 40rpx;
			text-align: center;
			padding-top: 15%;
			.logo-title {
				color: #044F9F;
				font-size: 56rpx;
				font-family: PingFang SC;
				font-style: normal;
				font-weight: 600;
				line-height: 80rpx;
				text-align: center;
				margin-bottom: 40rpx;
			}

			image {
				border-radius: 8rpx;
			}

			.title {
				margin-left: 20rpx;
			}
		}

		.login-form-content {
			text-align: center;
			margin: 40rpx auto;
			margin-top: 15%;
			width: 80%;

			.input-item {
				margin: 40rpx auto;
				background-color: #f5f6f7;
				height: 90rpx;
				border-radius: 40rpx;

				.icon {
					font-size: 38rpx;
					margin-left: 20rpx;
					color: #999;
				}

				.input {
					width: 100%;
					font-size: 28rpx;
					line-height: 40rpx;
					text-align: left;
					padding-left: 30rpx;
				}

			}

			.login-btn {
				margin-top: 80rpx;
				height: 90rpx;
			}

			// .xieyi {
			//   color: #333;
			//   margin-top: 20px;
			// }

			// .login-code {
			//   height: 38px;
			//   float: right;

			//   .login-code-img {
			//     height: 38px;
			//     position: absolute;
			//     margin-left: 10px;
			//     width: 200rpx;
			//   }
			// }
		}
	}

	.uni-eye {
		width: 48rpx;
		height: 48rpx;
		font-size: 68rpx;

		/deep/ .u-icon__icon {
			font-size: 44rpx !important;
		}
	}
</style>